<template>
	<view class="wrap-item flex align-center just-between" v-if="item">
		<view class="title-bg f-30 flex">
			<view class="must" v-if="item.require">*</view>
		
			<view class="title">{{ item.title }}</view>
		</view>
		
		<switch class="switch" :checked='value === "1"' color="#DD551B" @change="onChange" />
	</view>
</template>

<script>
	export default {
		props: {
			/**
			 * 输入框的值
			 */
			value: {
				type: String,
				default: "",
			},
			/**
			 * 数据
			 */
			item: {
				type: Object,
				default: null,
			},
		},
		methods: {
			/**
			 * 修改
			 */
			onChange(e) {
				const value = e.detail.value;
				if (value === true) {
					this.$emit('input', "1");
				} else {
					this.$emit('input', "0");
				}
			},
		}
	};
</script>

<style lang="scss" scoped>
	@import "@/css/publish.css";
	
	.switch {
		color: $theme-color;
		transform: scale(1);
	}
</style>